<template>
	<div v-show="showPage">
		<div style="border-bottom: 1px solid #ddd;">
			<h3>审批配置</h3>
		</div>
		<div style="margin-top: 10px;">
			<el-table :data="data" style="width: 100%;" size="mini" border="true" stripe="true">
				<el-table-column type="index" width="50" />
				<el-table-column label="名称">
					<template #default="scope">
						<el-input size="mini" v-model="scope.row.name"></el-input>
					</template>
				</el-table-column>
				<el-table-column label="角色">
					<template #default="scope">
						<el-select size="mini" v-model="scope.row.roleValueList" placeholder="请选择"  multiple clearable filterable>
							<el-option v-for="item in rolePairList" :key="item.value" :label="item.name" :value="item.value">
							</el-option>
						</el-select>
					</template>
				</el-table-column>
				<el-table-column label="用户">
					<template #default="scope">
						<el-select size="mini" v-model="scope.row.userValueList" placeholder="请选择"  multiple clearable filterable>
							<el-option v-for="item in userPairList" :key="item.value" :label="item.name" :value="item.value">
							</el-option>
						</el-select>
					</template>
				</el-table-column>
				<el-table-column label="表达式">
					<template #default="scope">
						<el-input size="mini" v-model="scope.row.assignmentExpression"></el-input>
					</template>
				</el-table-column>
			</el-table>
		</div>
	</div>
</template>

<script>
	import restUtil from '@/utils/restUtil.js';
	export default {
		name: "ApprovalConfigPage",
		props: ["scope"],
		data() {
			return {
				showPage: false,
				approvalLevel: 0,
				data: [],
				rolePairList:[],
				userPairList:[],
			}
		},
		methods: {
			init() {
				var that = this;
				restUtil.getAction(this,"webide/workflowwizarddialog/initApprovalConfigPage").then(
					function(response) {
						if (response.data.code == 1) {
							that.rolePairList = response.data.rolePairList;
							that.userPairList = response.data.userPairList;
						} else {
							that.$alert(response.data.message, '提示')
						}
					});
			},
			setVisible(visible) {
				this.showPage = visible;
				if (visible) {
					if(this.rolePairList.length==0){
						this.init();
					}
					var aLevel = this.scope["approvalLevelPage"]["approvalLevel"];
					if (aLevel != this.approvalLevel) {
						this.approvalLevel=aLevel;
						this.data=[];
						for(var i=0;i<aLevel;i++){
							var item={
								"name":"审批",
								"roleValueList":[],
								"userValueList":[],
								"assignmentExpression":""
							}
							this.data.push(item);
						}
					}
				}
			},
			getReturnData() {
				return {
					"data": this.data,
				};
			},
			getPreviousPage() {
				return "approvalLevelPage";
			},
			getNextPage() {
				return undefined;
			},
			isCompletedPage() {
				return true;
			}
		},
	}
</script>

<style>
</style>
